<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>ajax_jquery</title>
		<script src="../jquery/jquery-1.6.1.js"></script>
	</head>
<body>
	Ajax_JQuery
	<hr color="red">
	id:<input type="text" name="id" class="user" id="id">
	name:<input type="text" name="name" class="user" id="name"><br>
	Returned：<br>
	<table id="user" ></table>
</body>
<script type="text/javascript">
//类似于window.onload 
$(document).ready(function(){
	//通过类选择器一次注册2个文本框的事件
	$(".user").blur(function(){
		$.ajax({
			type:"POST",
			url:"/test/Ajax02",
			data:{id:$("#id").val(),name:$("#name").val()},
			success:function(returnedData){
				var tr="<tr><td>"+returnedData+"</td></tr>";
				//$("#user tr:eq(0)").remove();
				//$("#user").append(tr);
				//上面2条作用和下面这条一样 
				$("#user").empty().append(tr);
				$("#user").css("background","pink");
			}
		});
	});
});
</script>
</html>